<div *ngFor="let item of data; let last = last; let i = index">
  <div class="item">
    <div class="name">
      <ng-container *ngIf="item.had_child !== 0">
        <span class="icon" (click)="loadData(item, i)" *ngIf="!item.loading && !item?.children">
          <span class="material-icons"> keyboard_arrow_right </span></span>
        <span class="icon" *ngIf="!item.loading && item?.children" (click)="close(item)">
          <span class="material-icons"> keyboard_arrow_down </span></span>
        <span class="icon" *ngIf="item.loading">
          <span class="material-icons"> rotate_right </span>
        </span>
      </ng-container>
      <span class="itemName">
        <ng-container *ngIf="selectBox">
          <mat-checkbox [(ngModel)]="item.checked" class="checkbox" *ngIf="selection?.multiple" (change)="selectCheckbox()"></mat-checkbox>
          <!-- 此处的dir属性禁止删除，影响严重 -->
          <mat-radio-button [dir]="JSON_stringify(item)" *ngIf="!selection?.multiple" class="radio" [value]="item" (click)="select(item)"></mat-radio-button>
        </ng-container>
        <m-go-detail *ngIf="goDetail" [g_name]="item.name" [g_id]="item.area_id">
          <span>
            {{ item.name }}/编码:
          </span>
          <!-- <span style="margin-left: 8px"> ({{ item.pc_count }}台) </span> -->
          <span style="margin-left: 8px">{{ item.id }}</span>
        </m-go-detail>

        <div *ngIf="!goDetail">
          <span>
            {{ item.name }}/编码:
          </span>
          <span style="margin-left: 8px">({{ item.id }})</span>
        </div>
      </span>

      <!-- <span class="add" (click)="addNode(item)"><span class="material-icons">
                    add_circle_outline
                </span></span> -->
    </div>
  </div>
  <div class="children" *ngIf="item?.children">
    <m-base-tree [id]="id" [selectBox]="selectBox" [selection]="selection" [data]="item?.children" [parent]="item" (roll)="srocllTop($event)" (item)="select($event)"></m-base-tree>
  </div>
  <div class="name" *ngIf="last && data.length % 50 == 0" (click)="loadMore(data, i)">
    <span class="icon"> </span><span class="itemName"> 加载更多</span>
  </div>
</div>

<!-- <mat-tree [dataSource]="data" [treeControl]="treeControl">
    <mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding>
        <button mat-icon-button disabled></button> {{node.item}}
    </mat-tree-node>
    <mat-tree-node *matTreeNodeDef="let node; when: hasChild" matTreeNodePadding>
        <button mat-icon-button [attr.aria-label]="'toggle ' + node.filename" matTreeNodeToggle>
      <mat-icon class="mat-icon-rtl-mirror">
        {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
      </mat-icon>
    </button> {{node.item}}
        <mat-progress-bar *ngIf="node.isLoading" mode="indeterminate" class="example-tree-progress-bar"></mat-progress-bar>
    </mat-tree-node>
</mat-tree> -->
